<template>
  <div>
    <van-nav-bar title="验证银行预留手机号" left-arrow @click-left="$router.back()"/>
    <div style="margin-top: 1.2rem;">
        <sendVerificationCode v-model="requestData.verifiedCode" :phoneNumber="phoneNumber" :requestUrl="requestUrl" :requestParam="requestParam" firstTimeNoRequest="'true'" requestMethod="postForm"></sendVerificationCode>
    </div>
    <div class="bottom_btn" @click="releaseShowClick">提交绑定</div>
  </div>
</template>
<script>
export default {
    name: "addBankCardCode",
    data() {
        return {
            requestData: {
                verifiedCode: '', //绑卡验证码
                bankCardId:''
            },
            phoneNumber:'',//电话号码
            requestParam: {//请求参数
                bankCardId: ''
            },
            requestUrl: this.__ctx + '/plugin/mobileBusiCenter/retrieveVerifiedCode',  //重新获取
        }
    },
    components: {  },
    mounted() {
    },
	created () {
        this.phoneNumber = this.$route.query.phone;
        this.requestParam.bankCardId = this.$route.query.id;
        this.requestData.bankCardId = this.$route.query.id;
	},
	computed: {

	},
    methods: {
        releaseShowClick(){
            this.$toast.loading({
                duration: 0, // 持续展示 toast
                forbidClick: true,
                message: '提交中，请稍后'
            });
            this.baseService.postForm(this.__ctx + '/plugin/mobileBusiCenter/checkVerifiedCode', this.requestData).then(res => {
                this.$toast.clear();
                if (res.isOk) {
                    this.$toast({
                        icon: 'success',
                        message: '银行卡绑定成功'
                    });
                    this.$router.replace({path: '/loanPage/allocateList'});
                } else {
                    this.$toast({
                        icon: 'warning',
                        message: res.msg
                    });
                }
            }, function (status) {
                this.$toast.clear();
                if (status == !0) {
                    this.$toast({
                        icon: 'warning',
                        message: '加载失败！' + status
                    });
                }
            });
        },
        valueChange(e){
            this.requestData.verifiedCode = e;
        },
        handleChange(e){
			this.show = false;
		},
        onConfirm(value) {
            this.value = value;
            this.showPicker = false;
        }
    }
  }
</script>

<style scoped lang="less">
/deep/.van-nav-bar{
  .van-nav-bar__content{
    height: 4.4rem;
    line-height: 2rem;
    .van-icon{
      color: rgb(50, 50, 51);
      font-size: 2rem;
    }
    .van-nav-bar__title{
      font-size: 1.8rem;
    }
  }
}
[class*=van-hairline]::after{
  border: 0;
}
.bottom_btn{
    width: calc(~'100% - 2.4rem');
    height: 4.4rem;
    margin: 1.8rem 1.2rem;
    background: linear-gradient(270.00deg, var(--primary-color), var(--gradient2-color));
    border-radius: 4rem;
    color: rgb(255, 255, 255);
    font-family: HarmonyOS Sans SC;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 4.4rem;
    letter-spacing: 0%;
    text-align: center;
    position: absolute;
    bottom: 0.6rem;
    left: 0;
}
</style>
<style>
